<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>工单管理-工单历史</title>
    <!-- jquery - boot -库文件 -->
    <script src="__PUBLIC__/script/jquery.1.11.1.js"></script>
    <script src="__PUBLIC__/script/bootstrap.min.js"></script>
    <!-- Bootstrap -->
    <link href="__PUBLIC__/css/bootstrap.min.css" rel="stylesheet">
    <!-- Bootstrap -->
    <!-- font awesome -->
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/plugins/FontAwesome/css/font-awesome.min.css">
    <script src="__PUBLIC__/script/common.js"></script>
    <!--easyui包含文件-->
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/plugins/easyui1.5.3/themes/material/easyui.css">
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/plugins/easyui1.5.3/themes/icon.css">
    <script type="text/javascript" src="__PUBLIC__/plugins/easyui1.5.3/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="__PUBLIC__/plugins/easyui1.5.3/locale/easyui-lang-zh_CN.js"></script>
    <!--layer-->
    <script type="text/javascript" src="__PUBLIC__/plugins/layer/layer.js"></script>
    <!-- 自定义 css -->
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/css/reset.css">
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/css/common.css">
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/css/style.css">
    <!-- end easyui -->
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="__PUBLIC__/script/html5shiv.js"></script>
    <script src="__PUBLIC__/script/respond.js"></script>
    <![endif]-->
</head>

<body>
<include file="Public/header" />
<!-- indexmain -->
<div class="container-fluid">
    <div class="row">
        <div class="col-md-12 mainbox" id="mainbox">
            <!--menubegin-->
            <div class="datamenubox" id="leftmenu">
                <div class="menuhead">工单管理</div>
                <!-- treein -->
                <div class="treein" id="menuin">
                    <ul class="list-group smenu">
                        <volist name="menulist" id="vo">
                            <a href="{:U($vo[url])}"><li class="list-group-item" id="{$vo.url}"><i class="fa fa-angle-right"></i>{$vo.name}</li></a>
                        </volist>
                    </ul>
                </div>
            </div>
            <!--menuend-->
            <!--mainboxbegin-->
            <div class="col-md-12 rights" id="right">
                <!-- 位置导航 -->
                <ol class="breadcrumb">
                    <li class="active">首页</li>
                    <li class="active">视频监控</li>
                </ol>
                <!-- 筛选 -->
                <div class="searchitem">
                    <div class="row">
                        <div class="col-md-12">
                            <input class="easyui-textbox" name="q_name" id="q_name" style="width:300px" data-options="label:'标题：',required:false">
                            <button class="btn btn-danger" id="querybtn">查询</button>
                        </div>
                    </div>
                    <div class="blank10"></div>
                </div>
                <!-- listtable -->
                <div>
                    <!-- gridview row -->
                    <table id="dg"></table>
                    <!-- end gridview row -->
                </div>
                <!--mainboxend-->
            </div>
        </div>
    </div>
    <div id="w" class="easyui-window" title="添加/编辑用户" data-options="modal:true,closed:true" style="width:500px;height:400px;padding:15px;display:none;">
        <div class="row">
            <div class="col-md-12">
                <form id="ff" method="post" data-options="novalidate:true">
                    <div class="row">
                        <div class="col-md-6">
                            <input class="easyui-combobox" name="lx" id="lx" style="width:180px" data-options="label:'类型：',valueField:'id',textField:'text',panelHeight:'100',required:true">
                        </div>
                        <div class="col-md-6">
                            <input class="easyui-combobox"   name="weizhi" id="weizhi" style="width:180px" data-options="label:'位置：',valueField:'id',textField:'text',panelHeight:'100',required:true">
                        </div>
                    </div>
                    <div class="blank10"></div>
                    <div class="row">
                        <div class="col-md-6">
                            <input class="easyui-textbox" name="xm" id="xm" style="width:180px" data-options="label:'项目：',valueField:'id',textField:'text',panelHeight:'100',required:true">
                        </div>
                        <div class="col-md-6">
                            <input class="easyui-datebox"  type="text" name="sj" id="sj" style="width:180px" data-options="label:'时间：',required:true">
                        </div>
                    </div>
                    <div class="blank10"></div>
                    <div class="row">
                        <div class="col-md-12">
                            <input class="easyui-textbox" name="xq" id="xq" style="width: 300px;" data-options="label:'详情：',prompt:'不能超过50个字',valueField:'id',textField:'text',panelHeight:'100',required:true"/>
                        </div>
                    </div>
                    <div class="blank10"></div>
                    <div class="row">
                        <div class="col-md-6">
                            <input class="easyui-combobox" name="ry" id="ry" style="width:180px" data-options="label:'人员：',valueField:'id',textField:'text',panelHeight:'100',required:true"/>
                        </div>
                    </div>
                    <input type="hidden" id="hidid" name="hidid" />
                </form>
                <div class="blank10"></div>
                <div class="btnin">
                    <a class="btn btn-info" id="submits">保存</a>&nbsp;
                    <a class="btn btn-default" id="clear">重置</a>
                </div>
            </div>
        </div>
    </div>
    <div id="h" class="easyui-window" title="{$h.xm}/{$h.xq}" data-options="modal:true,closed:true" style="width:600px;height:500px;padding:15px;display:none;">
        <div class="box-group-item">
            <p>{$h.jz}  {$h.sj}</p>
            <p>{$h.xq}</p>
            <div class="box-group-item-right">
                {$h.zp}
            </div>
        </div>

    </div>

</div>
<include file="Public/footer" />
<script>
    $(document).ready(function() {
        //初始化页面
        $('#gdls').addClass('on');
        loaddg();
        LoadDDL('lx','LX');
        LoadDDL('weizhi','WEIZHI');
        LoadDDL('ry','RY');
    });
    //加载数据列表
    function loaddg() {
        $('#dg').datalist({
            loadMsg: '正在查询，请稍后...',
            height: $(window).height() - 300,
            url: '{:U(\'querygd\')}',
            queryParams: {
                username: $('#q_name').textbox('getValue')
            },
            nowrap: false,
            striped: true,
            collapsible: false,
            loadMsg: '正在加载，请稍后。。。',
            remoteSort: false,
            singleSelect: false,
            pageSize: 100,
            idField: 'id',
            pagination: true,
            rownumbers: false,
            pagination: true,
            pageNumber: 1,
            pageSize: 20,
            pageList: [20, 40, 80, 160],
            fitColumns: true,
            checkbox:true,
            columns: [
                [{
                    field: 'id',
                    title: '工单号',
                    width: 100
                }, {
                    field: 'lx',
                    title: '类别',
                    width: 100
                }, {
                    field: 'ry',
                    title: '工程师',
                    width: 100
                }, {
                    field: 'xm',
                    title: '服务企业',
                    width: 100
                }, {
                    field: 'sj',
                    title: '发起时间',
                    width: 100
                }, {
                    field: 'cz',
                    title: '操作',
                    width: 100
                }]
            ],
            onDblClickRow:function(index,row){
                $('#h').window('open');
                $('#piclist').html('');
                document.getElementById("hidid").value = row.id;
                loadphoto(row.id);
            }
        });
        $("#querybtn").click(function() {
            $('#dg').datagrid('load', {
                "uname": $('#q_name').textbox('getValue')
            });
        });
    }
    function loadphoto(id){
        var html='';
        var option = {
            type: "POST",
            url: "{:U('queryphoto')}",
            data: {id:id},
            success: function (data) {
                for(var i=0;i<data.length;i++){
                    html+='<div class="col-md-12" style="margin-top: 3px;">' +
                        '<a href="'+data[i]['img_path']+'" target="_blank"</a>现场照片</div>';
                }
                $('#piclist').html(html);
            }
        };
        $.ajax(option);
    }
    // 发起工单页面
    $("#fqbtn").click(function() {
        $('#ff').form('clear');
        document.getElementById("hidid").value = "I";
        $('#w').window('open');
    })
    //编辑
    $("#updatebtn").click(function() {
        var row = $('#dg').datagrid('getSelected');
        if (row) {
            $('#ff').form('clear');
            document.getElementById("hidid").value = row.id;
            $('#lx').combobox('setValue',row.lx);
            $('#ry').combobox('setValue',row.ry);
            $('#xm').textbox('setValue',row.xm);
            $('#sj').datebox('setValue',row.sj);
            $('#weizhi').combobox('setValue',row.weizhi);
            $('#xq').textbox('setValue',row.xq);
            $('#w').window('open');
        }
        else{
            layer.msg('请选择需要编辑的用户！');
        }
    })

    //重置
    $('#clear').click(function(){
        $('#ff').form('clear');
    })

    //删除
    $('#delbtn').click(function(){
        var row = $('#dg').datagrid('getChecked');
        if(row){
            layer.confirm('您确定要删除选中的数据？', {
                btn: ['是','否'] //按钮
            }, function(){
                var option = {
                    type: "POST",
                    url: "{:U('delgd')}",
                    data: {id:row.id},
                    success: function (data) {
                        layer.close();
                        layer.msg(data);
                        $("#querybtn").click();
                    }
                };
                $.ajax(option);
            }, function(){
                layer.closeAll();
            });
        }
        else{
            layer.msg('请选择需要删除的数据！');
        }
    })
    //发起工单
    $('#submits').click(function(){
        var url="";
        var flg = document.getElementById("hidid").value;
        if (flg == "I") {
            url = "{:U('addwork')}";
        } else {
            url = "{:U('editgd')}";
        }
        $('#ff').form('submit', {
            url: url,
            onSubmit: function(param){
                var isOk = false;
                isOk = $(this).form('enableValidation').form('validate');
                return isOk;
            },
            success: function (data) {
                layer.msg(JSON.parse(data));
                $('#ff').form('clear');
                $('#w').window('close');
                $("#querybtn").click();
            }
        });
    })

</script>
</body>

</html>